<!--Productmgr产品记录  -->
<template>
  <a-card
    :bordered="false"
    :body-style="{ 'padding-bottom': '0px' }"
    :style="{ margin: '6px', padding: '0px' }"
  >
    <a-form
      ref="searchFormRef"
      name="advanced_search"
      :model="searchFormState"
      class="ant-advanced-search-form"
    >
      <a-row :gutter="24" v-show="advanced">
        <a-col :span="4">
          <a-form-item label="出厂编码" name="FacNo">
            <a-input
              v-model:value="searchFormState.FacNo"
              placeholder="请输入出厂编码"
              @keyup.enter="tableRef.refresh(true)"
            />
          </a-form-item>
        </a-col>
        <a-col :span="4">
          <a-form-item label="产品类型" name="PTID">
            <a-select
              v-model:value="searchFormState.PTID"
              style="width: 100%"
              placeholder="请选择产品类型"
              :options="productType"
            ></a-select>
          </a-form-item>
        </a-col>
        <a-col :span="4">
          <a-form-item label="产品型号" name="PMID">
            <a-select
              v-model:value="searchFormState.PMID"
              style="width: 100%"
              placeholder="请选择产品型号"
              :options="productModel"
            ></a-select>
          </a-form-item>
        </a-col>
        <a-col :span="4">
          <a-form-item label="批次" name="PBID">
            <a-select
              v-model:value="searchFormState.PBID"
              style="width: 100%"
              placeholder="请选择批次"
              :options="productBatch"
            ></a-select>
          </a-form-item>
        </a-col>
        <a-col :span="4">
          <a-form-item label="录入人" name="CreateUserID">
            <a-select
              v-model:value="searchFormState.CreateUserID"
              style="width: 100%"
              placeholder="请选择录入人"
              :options="userList"
            ></a-select>
          </a-form-item>
        </a-col>
        <a-col :span="4">
          <a-form-item label="检测人" name="CheckUserID">
            <a-select
              v-model:value="searchFormState.CheckUserID"
              style="width: 100%"
              placeholder="请选择检测人"
              :options="checkUserList"
            ></a-select>
          </a-form-item>
        </a-col>
      </a-row>
      <a-row :gutter="24" v-show="advanced">
        <a-col :span="4">
          <a-form-item label="打包人" name="PackageUserID">
            <a-select
              v-model:value="searchFormState.PackageUserID"
              style="width: 100%"
              placeholder="请选择打包人"
              :options="userList"
            ></a-select>
          </a-form-item>
        </a-col>
        
        <a-col :span="4">
          <a-form-item label="老化完成" name="IsAgePass">
            <a-select
              v-model:value="searchFormState.IsAgePass"
              style="width: 100%"
              placeholder="请选择老化完成状态"
              :options="[
                {
                  value: -1,
                  label: '全部',
                },
                {
                  value: 0,
                  label: '未完成',
                },
                {
                  value: 1,
                  label: '老化完成',
                },
              ]"
            ></a-select>
          </a-form-item>
        </a-col>
        <a-col :span="4">
          <a-form-item label="是否翻卡" name="IsFanKaPass">
            <a-select
              v-model:value="searchFormState.IsFanKaPass"
              style="width: 100%"
              placeholder="请选择翻卡状态"
              :options="[
                {
                  value: -1,
                  label: '全部',
                },
                {
                  value: 0,
                  label: '未翻卡',
                },
                {
                  value: 1,
                  label: '已翻卡',
                },
              ]"
            ></a-select>
          </a-form-item>
        </a-col>
        <a-col :span="4">
          <a-form-item label="检测合格" name="IsCheckPass">
            <a-select
              v-model:value="searchFormState.IsCheckPass"
              style="width: 100%"
              placeholder="请选择检测合格状态"
              :options="[
                {
                  value: -1,
                  label: '全部',
                },
                {
                  value: 0,
                  label: '待检测',
                },
                {
                  value: 1,
                  label: '合格',
                },
                {
                  value: 2,
                  label: '不合格',
                },
              ]"
            ></a-select>
          </a-form-item>
        </a-col>
        <a-col :span="4">
          <a-form-item label="是否打包" name="IsPackage">
            <a-select
              v-model:value="searchFormState.IsPackage"
              style="width: 100%"
              placeholder="请选择打包状态"
              :options="[
                {
                  value: -1,
                  label: '全部',
                },
                {
                  value: 0,
                  label: '未打包',
                },
                {
                  value: 1,
                  label: '已打包',
                },
              ]"
            ></a-select>
          </a-form-item>
        </a-col>
      </a-row>
  
      <a-row :gutter="24" v-show="advanced">
        <a-col :span="8">
          <a-form-item label="录入时间" name="createTime">
            <a-range-picker
              showTime
              v-model:value="searchFormState.createTime"
              :format="dayFormat"
            />
          </a-form-item>
        </a-col>
        <a-col :span="8">
          <a-form-item label="检测时间" name="checkTime">
            <a-range-picker
              showTime
              v-model:value="searchFormState.checkTime"
              :format="dayFormat"
            />
          </a-form-item>
        </a-col>

        <a-col :span="8">
          <a-form-item label="打包时间" name="packageTime">
            <a-range-picker
              showTime
              v-model:value="searchFormState.packageTime"
              :format="dayFormat"
            />
          </a-form-item>
        </a-col>
      </a-row>
      <a-row :gutter="24" >
        <a-col :span="4">
          <a-form-item label="托盘标识ID" name="RTPPID">
            <a-input
              v-model:value="searchFormState.RTPPID"
              placeholder="请输入托盘标识ID"
              readonly
            />
          </a-form-item>
        </a-col>
       
        
        <a-col :span="7">
          <a-form-item label="托盘标识" name="PrinterCode">
            <a-input
              v-model:value="searchFormState.PrinterCode"
              placeholder="请输入托盘标识"
              @keyup.enter="tableRef.refresh(true)"
            />
          </a-form-item>
        </a-col>
        <a-col :span="8">
          <a-button
            class="mr10"
            type="primary"
            @click="tableRef.refresh(true)"
            v-show="hasRole(route.meta.RolePower)"
            >查询</a-button
          >
          <a-button
            class="xn-mg08"
            @click="reset"
            v-show="hasRole(route.meta.RolePower)"
            >重置</a-button
          >
          <a @click="toggleAdvanced" style="margin-left: 8px">
            {{ advanced ? "收起" : "展开" }}
            <component :is="advanced ? 'up-outlined' : 'down-outlined'" />
          </a>
        </a-col>
      </a-row>
     
    </a-form>
  </a-card>
  <a-card :bordered="false" :style="{ margin: '6px' }">
    <s-table
      ref="tableRef"
      :columns="columns"
      :data="loadData"
      :alert="options.alert.show"
      bordered
      :row-key="(record) => record.ID"
      :tool-config="toolConfig"
      :row-selection="options.rowSelection"
      :scroll="{ x: 'max-content' }"
    >
      <template #operator>
        <a-space>
          <a-button
            type="primary"
            @click="exportData"
            v-show="hasRole(route.meta.RolePower)"
          >
            <template #icon><ToTopOutlined /></template>
            导出
          </a-button>
          <!--  <xn-batch-button
              buttonName="批量删除"
              icon="DeleteOutlined"
              buttonDanger
              :selectedRowKeys="selectedRowKeys"
              @batchCallBack="deleteBatchModule"
            /> -->
        </a-space>
      </template>
      <template #bodyCell="{ column, record }">
        <template v-if="column.dataIndex === 'icon'">
          <a-tag :color="record.color">
            <component :is="record.icon" />
          </a-tag>
        </template>
        <template v-if="column.dataIndex === 'AgeStatus'">
          <a-tag
            color="success"
            v-if="(record.HasAgeTimeLen === record.NeedAgeTimeLen)||(record.HasAgeTimeLen > record.NeedAgeTimeLen)"
          >
            <template #icon>
              <check-circle-outlined />
            </template>
            已完成
          </a-tag>
          <a-tag color="default" v-else>
            <template #icon>
              <clock-circle-outlined />
            </template>
            未完成
          </a-tag>
        </template>
        <template v-if="column.dataIndex === 'AgeProgress'">
          {{ record.HasAgeTimeLen }}/{{ record.NeedAgeTimeLen }}
        </template>
        <template v-if="column.dataIndex === 'CheckUserName'">
          {{ record.CheckUserName ? record.CheckUserName : "自动检测" }}
        </template>
        <template v-if="column.dataIndex === 'UpdateTime'">
          {{ transitionTime(record.UpdateTime) }}
        </template>
        <template v-if="column.dataIndex === 'PCBCodeUpdateTime'">
          {{ transitionTime(record.PCBCodeUpdateTime) }}
        </template>
        <template v-if="column.dataIndex === 'AgeUpdateTime'">
          {{ transitionTime(record.AgeUpdateTime) }}
        </template>
        <template v-if="column.dataIndex === 'CheckUpdateTime'">
          {{ transitionTime(record.CheckUpdateTime) }}
        </template>
        <template v-if="column.dataIndex === 'FanKaUpdateTime'">
          {{ transitionTime(record.FanKaUpdateTime) }}
        </template>
        <template v-if="column.dataIndex === 'PackUpdateTime'">
          {{ transitionTime(record.PackUpdateTime) }}
        </template>

        <template v-if="column.dataIndex === 'FanKaStatus'">
          <a-tag color="default" v-if="record.FanKaStatus == 0">
            <template #icon>
              <clock-circle-outlined />
            </template>
            未翻卡
          </a-tag>
          <a-tag color="success" v-if="record.FanKaStatus == 1">
            <template #icon>
              <check-circle-outlined />
            </template>
            已翻卡
          </a-tag>
        </template>
        <template v-if="column.dataIndex === 'CheckResult'">
          <a-tag color="default" v-if="record.CheckResult == 0">
            <template #icon>
              <clock-circle-outlined />
            </template>
            待检测
          </a-tag>
          <a-tag color="success" v-if="record.CheckResult == 1">
            <template #icon>
              <check-circle-outlined />
            </template>
            合格
          </a-tag>
          <a-tag color="error" v-if="record.CheckResult == 2">
            <template #icon>
              <close-circle-outlined />
            </template>
            不合格
          </a-tag>
        </template>
        <template v-if="column.dataIndex === 'PackStatus'">
          <a-tag color="default" v-if="record.PackStatus == 0">
            <template #icon>
              <clock-circle-outlined />
            </template>
            未打包
          </a-tag>
          <a-tag color="success" v-if="record.PackStatus == 1">
            <template #icon>
              <check-circle-outlined />
            </template>
            已打包
          </a-tag>
        </template>
      </template>
    </s-table>
  </a-card>
</template>
  
  <script setup name="productmgr">
import productmgrApi from "@/api/productManagement/productmgrApi";
import producttypemgrApi from "@/api/productManagement/producttypemgrApi";
import productmodelmgrApi from "@/api/productManagement/productmodelmgrApi";
import productbatchmgrApi from "@/api/productManagement/productbatchmgrApi";
import usermgrApi from "@/api/systemManagement/usermgrApi";

import { cloneDeep } from "lodash-es";
import { message } from "ant-design-vue";
import {
  transitionTime,
  getPreviousMonthDateTime,
  getCurrentDateTime,
} from "@/utils/time.js";
import { useRoute } from "vue-router";
const route = useRoute();
import { ref, onMounted } from "vue";
import dayjs from "dayjs";
// 查询区域显示更多控制
const advanced = ref(true);
const toggleAdvanced = () => {
  advanced.value = !advanced.value;
};
const dayFormat = "YYYY/MM/DD HH:mm:ss";

const searchFormState = ref({
  ID: 0,
  FacNo: "",
  PTID: 0,
  PMID: 0,
  PBID: 0,
  CreateUserID: 0,
  CreateStartTime: "",
  CreateEndTime: "",
  CheckUserID: -1,
  CheckStartTime: "",
  CheckEndTime: "",
  PackageUserID: 0,
  PackageStartTime: "",
  PackageEndTime: "",
  IsAgePass: -1,
  IsFanKaPass: -1,
  IsCheckPass: -1,
  IsPackage: -1,
  RTPPID: 0,
  PrinterCode: "",
  createTime: [
    dayjs(getPreviousMonthDateTime(), dayFormat),
    dayjs(getCurrentDateTime(), dayFormat),
  ],
  checkTime: [
    dayjs(getPreviousMonthDateTime(), dayFormat),
    dayjs(getCurrentDateTime(), dayFormat),
  ],
  packageTime: [
    dayjs(getPreviousMonthDateTime(), dayFormat),
    dayjs(getCurrentDateTime(), dayFormat),
  ],
});
const formRef = ref();
const searchFormRef = ref();
const tableRef = ref();
const toolConfig = {
  refresh: true,
  height: true,
  columnSetting: false,
  striped: false,
};
const columns = [
  {
    title: "出厂编码",
    dataIndex: "FacNo",
    align: "center",
    fixed: "left",
  },
  {
    title: "产品型号",
    dataIndex: "PMName",
    align: "center",
  },
  {
    title: "产品批次",
    dataIndex: "PBName",
    align: "center",
  },
  {
    title: "卡号",
    dataIndex: "CardNo",
    align: "center",
  },
  {
    title: "录入时间",
    dataIndex: "UpdateTime",
    align: "center",
  },
  {
    title: "录入人",
    dataIndex: "UserName",
    align: "center",
  },
  {
    title: "PCBA编码",
    dataIndex: "PCBCode",
    align: "center",
  },
  {
    title: "老化更新时间",
    dataIndex: "AgeUpdateTime",
    align: "center",
  },
  {
    title: "老化状态",
    dataIndex: "AgeStatus",
    align: "center",
  },
  {
    title: "老化进度",
    dataIndex: "AgeProgress",
    align: "center",
  },
  {
    title: "翻卡更新时间",
    dataIndex: "FanKaUpdateTime",
    align: "center",
  },
  {
    title: "翻卡状态",
    dataIndex: "FanKaStatus",
    align: "center",
  },
  {
    title: "检测更新时间",
    dataIndex: "CheckUpdateTime",
    align: "center",
  },
  {
    title: "检测结果",
    dataIndex: "CheckResult",
    align: "center",
  },
  {
    title: "检测人",
    dataIndex: "CheckUserName",
    align: "center",
  },

  {
    title: "打包更新时间",
    dataIndex: "PackUpdateTime",
    align: "center",
  },
  {
    title: "打包状态",
    dataIndex: "PackStatus",
    align: "center",
  },
  {
    title: "打包人",
    dataIndex: "PackUserName",
    align: "center",
  },

  {
    title: "托盘标签",
    dataIndex: "PrinterCode",
    align: "center",
  },

  //   {
  //     title: "操作",
  //     dataIndex: "action",
  //     align: "center",
  //     width: "200px",
  //     fixed: "right",
  //   },
];
// 列表选择配置
const options = {
  alert: {
    show: false,
    clear: () => {},
  },
};
let searchAndExportFormParam = ref({});
const loadData = (parameter) => {
  const searchFormParam = cloneDeep(searchFormState.value);
  if (JSON.stringify(searchFormParam.createTime) != "[]") {
    searchFormParam.CreateStartTime = dayjs(
      searchFormParam.createTime[0]
    ).format(dayFormat);
    searchFormParam.CreateEndTime = dayjs(searchFormParam.createTime[1]).format(
      dayFormat
    );
    delete searchFormParam.createTime;
  } else {
    searchFormParam.CreateStartTime = getPreviousMonthDateTime();
    delete searchFormParam.createTime;
  }
  if (JSON.stringify(searchFormParam.checkTime) != "[]") {
    searchFormParam.CheckStartTime = dayjs(searchFormParam.checkTime[0]).format(
      dayFormat
    );
    searchFormParam.CheckEndTime = dayjs(searchFormParam.checkTime[1]).format(
      dayFormat
    );
    delete searchFormParam.checkTime;
  }
  if (JSON.stringify(searchFormParam.packageTime) != "[]") {
    searchFormParam.PackageStartTime = dayjs(
      searchFormParam.packageTime[0]
    ).format(dayFormat);
    searchFormParam.PackageEndTime = dayjs(
      searchFormParam.packageTime[1]
    ).format(dayFormat);
    delete searchFormParam.packageTime;
  }
  // 把查询条件保存到导出条件中
  searchAndExportFormParam.value = searchFormParam;
  return productmgrApi
    .getProducts(Object.assign(parameter, searchFormParam))
    .then((res) => {
      return res.Data;
    });
};
// 重置
const reset = () => {
  searchFormRef.value.resetFields();
  tableRef.value.refresh(true);
};

const exportData = () => {
  const hide = message.loading("正在导出数据，请稍后...", 0);

  productmgrApi
    .exportOutProducts(searchAndExportFormParam.value)
    .then((res) => {
      if (!res.Result) {
        hide()
        message.error("导出失败" + res.ResultMsg);
        return
      }
      hide()
      message.success("导出成功,即将开始下载");
      let a = document.createElement("a");
      let downUrl =
        import.meta.env.VITE_API_BASEURL + "/ExportFile/" + res.Data;
      if (downUrl.includes("/ntmgrwebws.asmx")) {
        downUrl = downUrl.replace("/ntmgrwebws.asmx", "");
      }
      a.href = downUrl;
      a.download = res.Data;
      a.click();
      a = null;
    }).catch(() => {
      hide();
      message.error("导出失败");
    });
};
// 产品类型下拉框数据

let productType = ref([]);
const fetchProductType = () => {
  producttypemgrApi
    .getProductTypes({
      ID: 0,
      PTName: "",
      PTNo: "",
    })
    .then((res) => {
      productType.value = res.Data.map((i) => {
        return {
          label: i.ProductTypeName,
          value: i.ID,
        };
      });
      productType.value.unshift({
        label: "全部",
        value: 0,
      });
    });
};
// 产品型号下拉框数据

let productModel = ref([]);
const fetchProductModel = () => {
  productmodelmgrApi
    .getProductModels({
      ID: 0,
      PMName: "",
      PMNo: "",
      PTID: 0,
    })
    .then((res) => {
      productModel.value = res.Data.map((i) => {
        return {
          label: i.PMName,
          value: i.ID,
        };
      });
      productModel.value.unshift({
        label: "全部",
        value: 0,
      });
    });
};
// 产品批次编号下拉
let productBatch = ref([]);
const fetchProductBatch = () => {
  productbatchmgrApi
    .getProductBatchs({
      ID: 0,
      PBName: "",
      PBNo: "",
      UserID: 0,
      PMID: 0,
      StartTime: dayjs(dayjs(getPreviousMonthDateTime(), dayFormat)).format(
        dayFormat
      ),
      EndTime: dayjs(dayjs(getCurrentDateTime(), dayFormat)).format(dayFormat),
    })
    .then((res) => {
      productBatch.value = res.Data.map((i) => {
        return {
          label: i.PBName,
          value: i.ID,
        };
      });
      productBatch.value.unshift({
        label: "全部",
        value: 0,
      });
    });
};
// 查询用户列表
const userList = ref([]);
const checkUserList = ref([]);
const fetchUserList = () => {
  usermgrApi
    .getUsers({ ID: 0, DeptID: 0, RoleID: 0, UserName: "", IsEnable: -1 })
    .then((res) => {
      userList.value = res.Data.map((i) => {
        return {
          label: i.UserName,
          value: i.ID,
        };
      });
      checkUserList.value = res.Data.map((i) => {
        return {
          label: i.UserName,
          value: i.ID,
        };
      });
      checkUserList.value.unshift(
        {
          label: "全部",
          value: -1,
        },
        {
          label: "自动检测",
          value: 0,
        }
      );
      userList.value.unshift({
        label: "全部",
        value: 0,
      });
    });
};

onMounted(() => {
  fetchProductType();
  fetchProductModel();
  fetchProductBatch();
  fetchUserList();
});
</script>
<style>
</style>
  